<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>2. 多线程与 IO | 被删的前端游乐场</title>
    <meta name="description" content="Just playing around">
    
    
    <link rel="preload" href="/front-end-playground/assets/css/0.styles.a683ed26.css" as="style"><link rel="preload" href="/front-end-playground/assets/js/app.e5cf4092.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/3.c853767c.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/2.eed49fdd.js" as="script"><link rel="preload" href="/front-end-playground/assets/js/12.9e3cdbaf.js" as="script">
    <link rel="stylesheet" href="/front-end-playground/assets/css/0.styles.a683ed26.css">
  </head>
  <body>
    <div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/front-end-playground/" class="home-link router-link-active"><!----> <span class="site-name">被删的前端游乐场</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/front-end-playground/" class="nav-link">概述</a></div><div class="nav-item"><a href="/front-end-playground/front-end-basic/" class="nav-link">前端基础</a></div><div class="nav-item"><a href="/front-end-playground/vue/" class="nav-link">Vue学习</a></div><div class="nav-item"><a href="/front-end-playground/wxapp/" class="nav-link">小程序学习</a></div><div class="nav-item"><a href="/front-end-playground/front-end-others/" class="nav-link">百家齐放</a></div><div class="nav-item"><a href="/front-end-playground/front-end-addon/" class="nav-link router-link-active">前端的进击</a></div><div class="nav-item"><a href="/front-end-playground/faq.html" class="nav-link">FAQ</a></div> <a href="https://github.com/godbasin/front-end-playground" target="_blank" rel="noopener noreferrer" class="repo-link">
    Github
    <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/front-end-playground/" class="nav-link">概述</a></div><div class="nav-item"><a href="/front-end-playground/front-end-basic/" class="nav-link">前端基础</a></div><div class="nav-item"><a href="/front-end-playground/vue/" class="nav-link">Vue学习</a></div><div class="nav-item"><a href="/front-end-playground/wxapp/" class="nav-link">小程序学习</a></div><div class="nav-item"><a href="/front-end-playground/front-end-others/" class="nav-link">百家齐放</a></div><div class="nav-item"><a href="/front-end-playground/front-end-addon/" class="nav-link router-link-active">前端的进击</a></div><div class="nav-item"><a href="/front-end-playground/faq.html" class="nav-link">FAQ</a></div> <a href="https://github.com/godbasin/front-end-playground" target="_blank" rel="noopener noreferrer" class="repo-link">
    Github
    <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></nav>  <ul class="sidebar-links"><li><section class="sidebar-group collapsable depth-0" style="padding-top:10px;"><div class="kitty-main" data-v-0cd75e06><span class="stand" data-v-0cd75e06></span> <div class="cat" data-v-0cd75e06><div class="body" data-v-0cd75e06></div> <div class="head" data-v-0cd75e06><div class="ear" data-v-0cd75e06></div> <div class="ear" data-v-0cd75e06></div></div> <div class="face" data-v-0cd75e06><div class="nose" data-v-0cd75e06></div> <div class="whisker-container" data-v-0cd75e06><div class="whisker" data-v-0cd75e06></div> <div class="whisker" data-v-0cd75e06></div></div> <div class="whisker-container" data-v-0cd75e06><div class="whisker" data-v-0cd75e06></div> <div class="whisker" data-v-0cd75e06></div></div></div> <div class="tail-container" data-v-0cd75e06><div class="tail" data-v-0cd75e06><div class="tail" data-v-0cd75e06><div class="tail" data-v-0cd75e06><div class="tail" data-v-0cd75e06><div class="tail" data-v-0cd75e06><div class="tail" data-v-0cd75e06><div class="tail" data-v-0cd75e06></div></div></div></div></div></div></div></div></div></div> <p class="sidebar-heading open"><span>不止单线程</span> <span class="arrow down"></span></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/1-thread-and-progress.html" class="sidebar-link">1. 线程与进程</a></li><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/2-progress-and-io.html" class="active sidebar-link">2. 多线程与 IO</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/front-end-playground/front-end-addon/more-than-single-thread/2-progress-and-io.html#多线程" class="sidebar-link">多线程</a></li><li class="sidebar-sub-header"><a href="/front-end-playground/front-end-addon/more-than-single-thread/2-progress-and-io.html#单线程" class="sidebar-link">单线程</a></li><li class="sidebar-sub-header"><a href="/front-end-playground/front-end-addon/more-than-single-thread/2-progress-and-io.html#阻塞与非阻塞、同步与异步" class="sidebar-link">阻塞与非阻塞、同步与异步</a></li><li class="sidebar-sub-header"><a href="/front-end-playground/front-end-addon/more-than-single-thread/2-progress-and-io.html#io" class="sidebar-link">IO</a></li><li class="sidebar-sub-header"><a href="/front-end-playground/front-end-addon/more-than-single-thread/2-progress-and-io.html#参考" class="sidebar-link">参考</a></li></ul></li><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/3-interprocess-communication.html" class="sidebar-link">3. 进程间通信</a></li><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/4-network-progress-and-tcp-ip.html" class="sidebar-link">4. 网络进程通信和 TCP/IP 协议</a></li><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/5-http-and-websocket.html" class="sidebar-link">5. HTTP 与 Websocket</a></li><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/6-socket-and-socket-io.html" class="sidebar-link">6. 套接字（Socket）与 socket.io</a></li><li><a href="/front-end-playground/front-end-addon/more-than-single-thread/7-node-js.html" class="sidebar-link">7. node.js</a></li></ul></section></li><li><section class="sidebar-group collapsable depth-0" style="padding-top:;"><!----> <p class="sidebar-heading"><span>简单算法之 js 实现</span> <span class="arrow right"></span></p> <!----></section></li><li><section class="sidebar-group collapsable depth-0" style="padding-top:;"><!----> <p class="sidebar-heading"><span>不止纯前端</span> <span class="arrow right"></span></p> <!----></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><p>该系列主要作为曾经的纯前端，对后台和底层的一些弥补，涉及进程、网络通信，以及对 node.js 和相关框架的学习。本节我们学习一下单线程与多线程、阻塞、同步/异步和 IO 等内容。</p> <h1 id="围绕线程"><a href="#围绕线程" aria-hidden="true" class="header-anchor">#</a> 围绕线程</h1> <h2 id="多线程"><a href="#多线程" aria-hidden="true" class="header-anchor">#</a> 多线程</h2> <p>多线程，即便处理器只能运行一个线程，操作系统也可以通过快速的在不同线程之间进行切换，由于时间间隔很小，来给用户造成一种多个线程同时运行的假象。这样的程序运行机制被称为软件多线程。</p> <h3 id="多线程的假象"><a href="#多线程的假象" aria-hidden="true" class="header-anchor">#</a> 多线程的假象</h3> <p>大部分操作系统都支持多进程并发运行，现代的操作系统几乎都支持同时运行多个任务对于一个 CPU 而言，它在某个时间点上只能执行一个程序，也就是说，只能运行一个进程，CPU 不断地在这些进程之间轮换执行。<br>
因为 CPU 的执行速度快，所以 CPU 在多个进程之间轮换执行，但感觉到(宏观上)好像多个进程在同时执行。当然，如果启动的程序足够多，依然可以感觉到程序的运行速度下降。<br>
现代的操作系统都支持多进程的并发(轮换执行)，但在具体的实现细节上可能因为硬件和操作系统的不同而采用不同的策略。目前操作系统大多采用效率更高的抢占式多任务策略。</p> <h3 id="多线程的优点"><a href="#多线程的优点" aria-hidden="true" class="header-anchor">#</a> 多线程的优点</h3> <ul><li>进程之间不能共享内存，但同一进程中的线程之间共享内存非常容易</li> <li>系统创建进程需要为该进程重新分配系统资源，但创建线程则代价小得多，因此使用多线程来实现多任务并发比多进程的效率高</li> <li>多线程技术使程序的响应速度更快，因为用户界面可以在进行其它工作的同时一直处于活动状态</li></ul> <h3 id="多线程的缺点"><a href="#多线程的缺点" aria-hidden="true" class="header-anchor">#</a> 多线程的缺点</h3> <ul><li>等候使用共享资源时造成程序的运行速度变慢。这些共享资源主要是独占性的资源，如打印机等</li> <li>对线程进行管理要求额外的 CPU 开销。线程的使用会给系统带来上下文切换的额外负担。当这种负担超过一定程度时，多线程的特点主要表现在其缺点上，比如用独立的线程来更新数组内每个元素</li> <li>线程的死锁。即较长时间的等待或资源竞争以及死锁等多线程症状</li></ul> <h3 id="多线程-vs-多进程"><a href="#多线程-vs-多进程" aria-hidden="true" class="header-anchor">#</a> 多线程 VS 多进程</h3> <p>因为并不是说所有情况下用多线程都是好事，因为多线程的情况下，CPU 还要花时间去维护，CPU 处理各线程的请求时在线程间的切换也要花时间，所以一般情况下是可以不用多线程的，用了有时反而会得不偿失。大多情况下，要用到多线程的主要是需要处理大量的 IO 操作时或处理的情况需要花大量的时间等等，比如：读写文件、视频图像的采集、处理、显示、保存等。</p> <p>现代的体系，一般 CPU 会有多个核心，而多个核心可以同时运行多个不同的线程或者进程。<br>
当每个 CPU 核心运行一个进程的时候，由于每个进程的资源都独立，所以 CPU 核心之间切换的时候无需考虑上下文。当每个 CPU 核心运行一个线程的时候，由于每个线程需要共享资源，所以这些资源必须从 CPU 的一个核心被复制到另外一个核心，才能继续运算，这占用了额外的开销。换句话说，在 CPU 为多核的情况下，多线程在性能上不如多进程。</p> <h2 id="单线程"><a href="#单线程" aria-hidden="true" class="header-anchor">#</a> 单线程</h2> <p>说到单线程，身为 Javascript 出身的你我可能再熟悉不过了。</p> <p>如果有很多任务需要执行，不外乎三种解决方法。</p> <ol><li>排队。因为一个进程一次只能执行一个任务，只好等前面的任务执行完了，再执行后面的任务。</li> <li>新建进程。为每个任务新建一个进程。</li> <li>新建线程。因为进程太耗费资源，所以如今的程序往往允许一个进程包含多个线程，由线程去完成任务。</li></ol> <p>以 JavaScript 语言为例，它是一种单线程语言，所有任务都在一个线程上完成，即采用上面的第一种方法。一旦遇到大量任务或者遇到一个耗时的任务，网页就会出现&quot;假死&quot;，因为 JavaScript 停不下来，也就无法响应用户的行为。</p> <h3 id="单线程缺点"><a href="#单线程缺点" aria-hidden="true" class="header-anchor">#</a> 单线程缺点</h3> <p>如上所说，使用单线程，当执行某个耗时或者不能立即完成的任务时，比如：网络通讯、复杂运动，该线程就会暂时停止对其他任务的响应和处理，造成的视觉效果就是程序的“假死”，也就是应用程序被卡在那里无法继续执行。</p> <h2 id="阻塞与非阻塞、同步与异步"><a href="#阻塞与非阻塞、同步与异步" aria-hidden="true" class="header-anchor">#</a> 阻塞与非阻塞、同步与异步</h2> <h3 id="阻塞与非阻塞"><a href="#阻塞与非阻塞" aria-hidden="true" class="header-anchor">#</a> 阻塞与非阻塞</h3> <p>阻塞和非阻塞关注的是程序在等待调用结果（消息，返回值）时的状态。</p> <p>阻塞调用是指调用结果返回之前，当前线程会被挂起。调用线程只有在得到结果之后才会返回。<br>
非阻塞调用指在不能立刻得到结果之前，该调用不会阻塞当前线程。</p> <h3 id="同步与异步"><a href="#同步与异步" aria-hidden="true" class="header-anchor">#</a> 同步与异步</h3> <p>同步是指代码调用 IO 操作时，必须等待 IO 操作完成才返回的调用方式。<br>
异步是指代码调用 IO 操作时，不必等 IO 操作完成就返回的调用方式。</p> <p>同步是最原始的调用方式，异步则需要多线程，多 CPU 或者非阻塞 IO 的支持。</p> <h3 id="区分"><a href="#区分" aria-hidden="true" class="header-anchor">#</a> 区分</h3> <ol><li>同步与异步是关于指令执行顺序的，阻塞非阻塞是关于线程与进程的。</li> <li>同步和异步关注的是消息通信机制，阻塞和非阻塞关注的是程序在等待调用结果（消息，返回值）时的状态。</li></ol> <p>骚年也来学学讲故事吧--小白拿外卖的故事：</p> <ul><li>同步阻塞：小白点了外卖，在餐馆等，看到外卖好了拿走（小白干等，主动查看外卖进展）</li> <li>同步非阻塞：小白点了外卖，然后去买饮料、买水果，时不时回来看看，等外卖好了拿走（小白不用等，主动查看外卖进展）</li> <li>异步阻塞：小白点了外卖，在餐馆等，外卖好了服务员通知让他拿走（小白干等，外卖进展自动通知）</li> <li>异步非阻塞：小白点了外卖，然后去买饮料、买水果，外卖好了服务员跑来通知让他拿走（小白不用等，外卖进展自动通知）</li></ul> <h2 id="io"><a href="#io" aria-hidden="true" class="header-anchor">#</a> IO</h2> <p>IO 是输入 input 输出 output 的首字母缩写形式，直观意思是计算机输入输出，它描述的是计算机的数据流动的过程，因此 IO 第一大特征是有数据的流动。<br>
从计算机架构上来讲，任何涉及到计算机核心（CPU 和内存）与其他设备间的数据转移的过程就是 IO。本体就是计算机核心（CPU 和内存）。例如从硬盘上读取数据到内存，是一次输入，将内存中的数据写入到硬盘就产生了输出。在计算机的世界里，这就是 IO 的本质。</p> <p>UNIX 中有五种 IO 模型，下面用两个阶段说明：</p> <ol><li>等待数据</li> <li>拷贝数据</li></ol> <h3 id="阻塞式-io（blocking-io）"><a href="#阻塞式-io（blocking-io）" aria-hidden="true" class="header-anchor">#</a> 阻塞式 IO（blocking IO）</h3> <p>默认情况下，Linux 下的所有 socket 都是阻塞的。<br>
在 I/O 执行的两个阶段都被阻塞了——阻塞等待数据，阻塞拷贝数据。</p> <h3 id="非阻塞式-io（non-blocking-io）"><a href="#非阻塞式-io（non-blocking-io）" aria-hidden="true" class="header-anchor">#</a> 非阻塞式 IO（non-blocking IO）</h3> <p>当对一个非阻塞 socket 执行读操作时，如果内核中的数据还没有准备好，那么它并不会阻塞用户进程，而是立刻返回一个 EWOULDBLOCK 错误。<br>
在 I/O 执行的第一个阶段不会阻塞线程，但在第二阶段会阻塞。</p> <h3 id="io-复用（io-multiplexing）"><a href="#io-复用（io-multiplexing）" aria-hidden="true" class="header-anchor">#</a> IO 复用（IO multiplexing）</h3> <p>也称事件驱动 IO(event-driven IO)，就是在单个线程里同时监控多个套接字，通过<code>select</code>或<code>poll</code>轮询所负责的所有 socket，当某个 socket 有数据到达了，就通知用户进程。<br>
进行了两次系统调用，进程先是阻塞在 select/poll 上，再是阻塞在读操作的第二个阶段上。</p> <h3 id="信号驱动式-io（signal-driven-io）"><a href="#信号驱动式-io（signal-driven-io）" aria-hidden="true" class="header-anchor">#</a> 信号驱动式 IO（signal driven IO）</h3> <p>让内核在描述符就绪时发送 SIGIO 信号通知用户进程。<br>
在等待数据 ready 期间进程不被阻塞，当收到信号通知时再阻塞并拷贝数据。</p> <h3 id="异步-io（asynchronous-io）"><a href="#异步-io（asynchronous-io）" aria-hidden="true" class="header-anchor">#</a> 异步 IO（asynchronous IO）</h3> <p>用户进程在发起 aio_read 操作后，该系统调用立即返回。然后内核会自己等待数据 ready，并自动将数据拷贝到用户内存。整个过程完成以后，内核会给用户进程发送一个信号，通知 IO 操作已完成。<br>
异步 IO 的特点是 IO 执行的两个阶段都由内核去完成，用户进程无需干预，也不会被阻塞。</p> <p>五种 IO 模型的比较：<br>
前 4 种模型的主要区别在于第一阶段，因为它们的第二阶段是一样的：都是阻塞于 recvfrom 调用，将数据从内核拷贝到用户进程缓冲区。</p> <p><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/20160718170600861" alt="images"></p> <h2 id="参考"><a href="#参考" aria-hidden="true" class="header-anchor">#</a> 参考</h2> <ul><li><a href="http://www.jianshu.com/p/7d9686cfcfbf" target="_blank" rel="noopener noreferrer">《单线程和多线程的简单理解》<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://zh.wikipedia.org/wiki/%E5%A4%9A%E7%BA%BF%E7%A8%8B" target="_blank" rel="noopener noreferrer">多线程- 维基百科<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://www.zhihu.com/question/19732473" target="_blank" rel="noopener noreferrer">怎样理解阻塞非阻塞与同步异步的区别？<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://github.com/calidion/calidion.github.io/issues/40" target="_blank" rel="noopener noreferrer">《同步，异步，阻塞，非阻塞等关系轻松理解》<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="http://www.jianshu.com/p/fa7bdc4f3de7" target="_blank" rel="noopener noreferrer">《程序员应该这样理解 IO》<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="https://songlee24.github.io/2016/07/19/explanation-of-5-IO-models/" target="_blank" rel="noopener noreferrer">《IO 模型：同步、异步、阻塞、非阻塞》<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li> <li><a href="http://blog.sina.com.cn/s/blog_4e8b57db0100o1ji.html" target="_blank" rel="noopener noreferrer">《单线程和多线程的优缺点》<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></a></li></ul> <h1 id="结束语"><a href="#结束语" aria-hidden="true" class="header-anchor">#</a> 结束语</h1> <p>这一节主要作为对线程的补充，收集了相关的一些 IO 等的资料。<br>
身为一个 JSer，对多线程、阻塞、同步等的理解都很少，整理笔记的同时也强迫学习了一波。</p></div> <!----> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/godbasin/front-end-playground/edit/sourcecode/docs/front-end-addon/more-than-single-thread/2-progress-and-io.md" target="_blank" rel="noopener noreferrer">帮阿猪改善此页面！</a> <svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></div> <!----> <blockquote>部分文章中使用了一些网站的截图，如果涉及侵权，请告诉我删一下谢谢~</blockquote> <div style="margin-top:30px;"><div class="el-row" style="margin-left:-10px;margin-right:-10px;"><div class="el-col el-col-24 el-col-sm-0 el-col-md-2 el-col-lg-4" style="padding-left:10px;padding-right:10px;display:block;"><div style="width:1px;height:1px;"></div></div> <div class="el-col el-col-24 el-col-sm-24 el-col-md-18 el-col-lg-16" style="padding-left:10px;padding-right:10px;"><div class="el-card box-card is-always-shadow"><div class="el-card__header"><div class="clearfix"><span>温馨提示喵</span></div></div><div class="el-card__body"> <div class="el-row" style="margin-left:-10px;margin-right:-10px;"><div class="el-col el-col-24 el-col-xs-24 el-col-sm-12" style="padding-left:10px;padding-right:10px;"><div class="el-image"><div class="image-slot"><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/loading.gif" style="width:100%;"></div><!----></div></div> <div class="el-col el-col-24 el-col-xs-24 el-col-sm-12" style="padding-left:10px;padding-right:10px;"><div class="copyright-text"><div>本文版权归作者所有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。</div> <div>出处：被删的前端游乐场</div> <div>作者：<a href="https://github.com/godbasin" target="_blank">被删</a></div></div></div></div></div></div></div></div></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
        ←
        <a href="/front-end-playground/front-end-addon/more-than-single-thread/1-thread-and-progress.html" class="prev">
          1. 线程与进程
        </a></span> <span class="next"><a href="/front-end-playground/front-end-addon/more-than-single-thread/3-interprocess-communication.html">
          3. 进程间通信
        </a>
        →
      </span></p></div>  <div class="gitalk-container theme-default-content"><div id="gitalk-container" class="content"></div></div></main> <div id="kitty-container"><span><div role="tooltip" id="el-popover-8790" aria-hidden="true" class="el-popover el-popper" style="width:undefinedpx;display:none;"><!----><img src="https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/2code2.jpg" class="image"> <div class="text">牡羊猪的猫粮罐</div> </div><div id="kitty" style="background:url(https://github-imglib-1255459943.cos.ap-chengdu.myqcloud.com/assets/img/kitty1.svg);"></div></span> <div class="el-dialog__wrapper" style="display:none;"><div role="dialog" aria-modal="true" aria-label="牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）" class="el-dialog" style="margin-top:15vh;"><div class="el-dialog__header"><span class="el-dialog__title">牡羊猪是这样渐渐胖成猪的喵（点击图片可以切换噢）</span><button type="button" aria-label="Close" class="el-dialog__headerbtn"><i class="el-dialog__close el-icon el-icon-close"></i></button></div><!----><!----></div></div></div></div><div class="global-ui"></div></div>
    <script src="/front-end-playground/assets/js/app.e5cf4092.js" defer></script><script src="/front-end-playground/assets/js/3.c853767c.js" defer></script><script src="/front-end-playground/assets/js/2.eed49fdd.js" defer></script><script src="/front-end-playground/assets/js/12.9e3cdbaf.js" defer></script>
  </body>
</html>
